<template>
  <div>
    <div class="center">
      <div class="row">
        <van-nav-bar
          @click-left="$router.back(-1)"
          style="width: 100%"
          title="宠物百科"
          left-arrow
          > 
          <template #right>
             <van-icon name="share" size="18" />        
          </template>
        </van-nav-bar>
      </div>
      <div class="wai">
        <div class="b">
                <img src="/1.jpg" />  
          <div class="bb">
             
            <div class="b1">
              <span class="b11">训练之前主人应当掌握的10条注意事项</span>
              <van-icon size="10px" name="arrow" />
            </div>
            <span class="b12">微凡</span>
          </div>
        </div>
      </div>
      <div class="wai">
        <div class="b">
                <img src="/1.jpg" />  
          <div class="bb">
             
            <div class="b1">
              <span class="b11">训练之前主人应当掌握的10条注意事项</span>
              <van-icon size="10px" name="arrow" />
            </div>
            <span class="b12">微凡</span>
          </div>
        </div>
      </div>
      <div class="wai">
        <div class="b">
                <img src="/1.jpg" />  
          <div class="bb">
             
            <div class="b1">
              <span class="b11">训练之前主人应当掌握的10条注意事项</span>
              <van-icon size="10px" name="arrow" />
            </div>
            <span class="b12">微凡</span>
          </div>
        </div>
      </div>
      <div class="wai">
        <div class="b">
                <img src="/1.jpg" />  
          <div class="bb">
             
            <div class="b1">
              <span class="b11">训练之前主人应当掌握的10条注意事项</span>
              <van-icon size="10px" name="arrow" />
            </div>
            <span class="b12">微凡</span>
          </div>
        </div>
      </div>
      <div class="wai">
        <div class="b">
                <img src="/1.jpg" />  
          <div class="bb">
             
            <div class="b1">
              <span class="b11">训练之前主人应当掌握的10条注意事项</span>
              <van-icon size="10px" name="arrow" />
            </div>
            <span class="b12">微凡</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>
<style scoped>
.center {
  width: 375px;
  margin: 0 auto;
  background-image: url("/public/bj.jpg");
}
.van-icon {
  display: flex;
  align-items: center;
}
.wai {
  padding: 0 10px;
}
.bb {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}
.b1 {
  display: flex;
}
.b1 span {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 230px;
}

.b {
  display: flex;
  margin-top: 4vh;
  /* padding: 15px 10px; */
}
.b img {
  width: 28vw;
  height: 14vh;
  padding-right: 8px;
}
</style>
